<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<!--[if lt IE 9]>
      		<script src="//cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
     	 	<script src="//cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    	<![endif]-->
    	<link rel="stylesheet" href="css/swiper.min.css" />
		<link rel="stylesheet" href="css/animate.min.css" />
		<script type="text/javascript" src="js/jquery-1.11.0.js" ></script>
		<script type="text/javascript" src="js/swiper.jquery.min.js" ></script>
		<script type="text/javascript" src="js/swiper.animate1.0.2.min (1).js" ></script>
		<script type="text/javascript" src="js/rem.js" ></script>
		<script type="text/javascript" src="js/open.js" ></script>
		<style>
			html,body,.swiper-container{
				width:100%;
				height: 100%;
				margin: 0;
				padding: 0;
				border: 0;
			}
			
			.swiper-pagination-bullet{width:30px;height:30px;background-color:#E4366B;}
			.slide1{
				background:url(img/a3.jpg) no-repeat center; 
			}
			.slide1 .a1{width:35%;margin-top:25%;}
			.slide1 .a2{width:50%;margin-top:10%;}
			.slide2{
				background:url(img/a5.jpg) no-repeat center; 
			}
			.slide2 .a3{width:40%;margin-top:100%;}
			.slide3{
				background:url(img/a7.jpg) no-repeat center; 
			}
			.slide3 .a4{width:40%;height:45%;margin-top: 10%;}
			.slide4{
				background:url(img/a9.jpg) no-repeat center; 
			}
			.slide4 .a5{width:60%;margin-top: 40%;}
			.slide5{
				background:url(img/a12.jpg) no-repeat center; 
			}
			.slide5 .a6{width:15%;margin-top:20%}
			.slide5 .a7{width:80%;margin-top:10%;}
			.slide5 .a8{width:50%;margin-top: 60%;}
			.swiper-slide{
				width:100%;
				height: 100%;
				background-size:100% 100%;
				text-align:center;
			}
		</style>
	</head>
	<body>
		<div class="swiper-container">
		    <div class="swiper-wrapper">
		    	<div class="swiper-slide slide1">
		        	<img src="img/a1.jpg" class="ani a1" swiper-animate-effect="bounceIn" swiper-animate-duration="0.3s" swiper-animate-delay="0"/><br/>
		        	<img src="img/a2.jpg" class="ani a2" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.6s" swiper-animate-delay="0"/>
		    	</div>
		        <div class="swiper-slide slide2">
		        	<img src="img/a4.jpg" class="ani a3" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.6s" swiper-animate-delay="0"/>
		        </div>
		        <div class="swiper-slide slide3">
		        	<img src="img/a6.jpg" class="ani a4" swiper-animate-effect="bounceInDown" swiper-animate-duration="1s" swiper-animate-delay="0"/>
		        </div>
		        <div class="swiper-slide slide4">
		        	<img src="img/a8.jpg" class="ani a5" swiper-animate-effect="zoomIn" swiper-animate-duration="1s" swiper-animate-delay="0"/>
		        </div>
		        <div class="swiper-slide slide5">
		        	<img src="img/a10.jpg" class="ani a6" swiper-animate-effect="bounceInDown" swiper-animate-duration="1s" swiper-animate-delay="0"/><br/>
		        	<img src="img/a11.jpg" class="ani a7" swiper-animate-effect="fadeInLeft" swiper-animate-duration="1s" swiper-animate-delay="0"/>
		        	<a href="index.html"> <img src="img/a13.jpg" class="ani a8" swiper-animate-effect="bounce" swiper-animate-duration="0.5s" swiper-animate-delay="0"/></a>
		        	
		    	</div>
		    </div>
    	
    		<div class="swiper-pagination"></div>
    		<!--<div class="swiper-scrollbar"></div>-->
	</div>
	</body>
</html>
